import 'package:flutter/material.dart';
import 'package:fluro/fluro.dart';
import 'package:provider/provider.dart';
import 'package:bookapp/models/common.dart';
import 'package:bookapp/widgets/common/common_title.dart';
import 'package:bookapp/helpers/constants.dart';
import 'package:bookapp/routers/application.dart';
import 'package:bookapp/helpers/fluro_convert_util.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:bookapp/stores/home_store.dart';


class Recommend extends StatelessWidget {
  const Recommend({Key? key}) : super(key: key);

  List<Widget> cardList(List<CommonData> recommendData){
    List<Widget> newArr = [];
    recommendData.forEach(
        (CommonData data){
          newArr.add(
            _CardItem(
              imageUrl: data.bookImage,
              title: data.title,
            )
          );
        }
    );
    return newArr;
  }

  @override
  Widget build(BuildContext context) {
    final homeStore = Provider.of<HomeStore>(
      context,
      listen: false,
    );

    return Observer(builder: (_){
      List<CommonData> recommendData = homeStore.recommendData.data;
      return recommendData == null ?
          Text("正在获取数据") :
          Column(
            children: <Widget>[
              CommonTitle(
                title: "推荐",
                onTap: (){
                  Application.getRouter().navigateTo(
                    context,
                    "/detail?title=${FluroConvertUtils.fluroCnParamsEncode('推荐')}&type=recommend",
                    transition: TransitionType.native,
                  );
                },
              ),
              Container(
                height: 140.0,
                margin: EdgeInsets.only(top:40.0,bottom: 18.0),
                child: ListView(
                  scrollDirection: Axis.horizontal,
                  children: cardList(homeStore.recommendData.data),
                ),
              ),
            ],
          );
    });
  }
}


class _CardItem extends StatelessWidget {
  final String imageUrl;
  final String title;

  _CardItem({required this.imageUrl,required this.title}): assert(imageUrl != null), assert(title != null);


  @override
  Widget build(BuildContext context) {
    return Container(
      width: 80,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(4.0)),
      ),
      margin: EdgeInsets.only(right: 18.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
            width: 80.0,
            height:80.0,
            child: ClipRRect(
              borderRadius: BorderRadius.circular(4.0),
              child:FadeInImage.assetNetwork(
                placeholder: 'assets/images/image_none.gif',
                image: this.imageUrl,
                fit:BoxFit.cover,
              ),
            ),
          ),

          SizedBox(height:8.0),
          Text(
            this.title,
            overflow: TextOverflow.ellipsis,
            maxLines:2,
            style: TextStyle(
              fontSize: 14.0,
              color: Color(AppColors.fontColor),
            ),
          ),
        ],
      ),
    );
  }
}
